
<template>
	<view class="loginWrap">
		<view class="_top_text">
			<text>您好，</text><br/>
			<text>请修改密码</text>
		</view>
		<form class="loginForm" :model="form" ref="uForm" @submit="toIndex">
			<view class="uni-form-item_other uni-column" style="margin-top: 110rpx;">
				<input class="uni-form-item_other_input" placeholder-class="pwd" placeholder="请输入邮箱" type="text" v-model="form.phone" />
			</view>
			<view class="uni-form-item_other uni-column" style="position: relative;">
				<input class="uni-form-item_other_input"  placeholder="请输入验证码"   v-model="form.code"/>
				<view class="wrap">
					<text style="height:36rpx;line-height: 36rpx;font-size:17px;position: absolute;right: 10rpx;top:32rpx;color:#18B998;" type="success" @click="getCheckNum">{{!codeTime?'获取验证码':codeTime+'s'}}</text>
				</view>
			</view>
			
			<view class="uni-form-item_other uni-column" style="position: relative;">
				<input class="uni-form-item_other_input"  v-if="pwdType == 'password'" type="password" placeholder="请输入6-13位数字和字母组合密码" placeholder-class="pwd" name="pwd"  v-model="form.password"/>
				<input class="uni-form-item_other_input"  v-if="pwdType == 'text'" type="text" placeholder="请输入6-13位数字和字母组合密码" placeholder-class="pwd" name="pwd"  v-model="form.password"/>
				<image style="height:36rpx;width:36rpx;position: absolute;right: 10rpx;top:22rpx;" @click="changeType()" :src="seen?openeye:nopeneye" mode="widthFix"/>
			</view>
			
			<!-- <view class="uni-form-item_bottom" >
				<radio style="transform:scale(0.7)" value="0" :checked="checkRedio" @click="checkVal"></radio>
				阅读并同意
				<text @click="agreement(1)" >《用户协议》</text>
				<text @click="agreement(2)" >《隐私政策》</text>
			</view> -->
		
			<button class="loginbtn" form-type="submit">修改密码</button>
			<view class="uni-form-item_bottom uni-column" style="text-align: right;padding-right: 15px;">
				<text >已修改密码，马上</text><text style="color: #18B998;"  @click="login()">登录</text>		
			</view>
		</form>
	</view>
</template>
 
<script>
	var _self;
	export default{
		onLoad(options) {
			_self=this
		},
		data(){
			return{
				form:{
					phone:'',
					code:'',
					password:'',
	
				},
				value:'',
				loginWay:'账号密码登录',
				seconds:60,
				tips:'获取验证码',
				pwdType: 'password', // 密码类型
				openeye: ('../../static/images/show.png'), //图片地址
				nopeneye: ('../../static/images/eye_shutdown.png'), //图片地址
				seen:'nopeneye',
				codeTime:0,
				checkRedio:false,
			}
		},
		methods:{
			toIndex: function(e) {
				if( this.form.phone == '' ) {
						uni.showToast({
						    title: '请输入邮箱',
						    duration: 2000,
							icon:'none'
						});
						return;
				}
				if (!(/^([a-zA-Z0-9_-])+@([a-zA-Z0-9_-])+(.[a-zA-Z0-9_-])+/.test(this.form.phone))) {
					uni.showToast({
						title: "邮箱格式不正确",
						icon: 'none'
					});
					return false;
				}
				
				if( this.form.code == '' ) {
						uni.showToast({
						    title: '请输入验证码',
						    duration: 2000,
							icon:'none'
						});
						return;
				}
				if( this.form.password == '' ) {
						uni.showToast({
						    title: '请输入密码',
						    duration: 2000,
							icon:'none'
						});
						return;
				}
				
				//密码验证// 密码格式为6-13位，必须有大小写字母和数字组成 
				var pwd = this.form.password;
				var reg = /^(?![0-9]+$)(?![a-zA-Z]+$)[0-9A-Za-z]{6,13}$/;
				
				if (!reg.test(pwd) || pwd.length < 6 || pwd.length > 13) {
					uni.showToast({
						title: "密码格式不正确",
						icon:'none'
					});     
					return false; 
				} 
			
				
				// if(!_self.checkRedio){
				// 	uni.showToast({
				// 		title: '请勾选注册协议',
				// 		duration: 2000,
				// 		icon:'none'
				// 	});
				// 	return;			
				// }
				var data = {
					mail:this.form.phone,
					password:this.form.password,
					code:this.form.code,
				};
				console.log(data)
				
				this.$api.forgetPasswordMail(data).then((res) => {
					var resData = res;
					console.log(resData)
					if (resData.code == "200") {
						uni.showToast({
							title: "密码修改成功",
							duration: 2000,
							icon: "none"
						});	
						uni.navigateTo({
							url: '../login/login'
						});
						
					} else {
						uni.showToast({
							title: resData.msg,
							duration: 2000,
							icon: "none"
						});
					}
				})
				
				
				
				// uni.request({
				// 	url: uri,
				// 	data:formData ,
				// 	method: 'POST',
				// 	header: {
				// 		'content-type': 'application/x-www-form-urlencoded'
				// 	},
				// 	success(res) {
				// 		var resData = res.data;	
				// 			//	console.log(resData)
				// 		if (resData.code == "200") {
				// 			//消息提示框
				// 			uni.showToast({
				// 				title: "注册成功",
				// 				duration: 2000,
				// 				icon: "none"
				// 			});	
				// 			console.log(resData)
				// 			setTimeout(() => {  
				// 				 uni.navigateTo({
				// 					url: '../authentication/authentication?id='+resData.data,
				// 				 });	      
				// 			 }, 2000);  
							
				// 		} else {
				// 			//消息提示框
				// 			uni.showToast({
				// 				title: resData.msg,
				// 				duration: 2000,
				// 				icon: "none"
				// 			});
				// 			return false;
				// 		}
				// 	},
				// 	fail: (res) => {
				// 		uni.showToast({
				// 			title:res.errMsg,
				// 			duration: 2000,
				// 			icon: "none"
				// 		});
				// 	}
				// })
			},
			login(){
				 uni.navigateTo({
					url: '../login/login'
				 });
			},
			checkVal(e){	

				 if(this.checkRedio){
				 	this.checkRedio = false
				 }else{
				 	this.checkRedio = true
				 }
			},
			 changeType() {
				this.pwdType = this.pwdType === 'password' ? 'text' : 'password';
				this.seen = !this.seen;//小眼睛的变化
			  },
			
			//注册协议
			agreement(type){
				uni.navigateTo({
					url: '/pages/me/agreement?type='+type
				  });
			},
			//
			codeChange(text) {
				// console.log("codeChange",text)
				this.tips = text;
			},
			
			//点击获取验证码倒计时
			  getCheckNum(){
					
					if( this.form.phone == '' ) {
							uni.showToast({
							    title: '请输入邮箱',
							    duration: 2000,
								icon:'none'
							});
							return;
					}
			
					if (!(/^([a-zA-Z0-9_-])+@([a-zA-Z0-9_-])+(.[a-zA-Z0-9_-])+/.test(this.form.phone))) {
						uni.showToast({
							title: "邮箱格式不正确",
							icon: 'none'
						});
						return false;
					}
					 if(this.codeTime>0){
						  uni.showToast({
							  title: '不能重复获取',
							  icon:"none"
						  });
						  return;
					 }else{
						  this.codeTime = 60
						  let timer = setInterval(()=>{
							  this.codeTime--;
							  if(this.codeTime<1){
							  clearInterval(timer);
							  this.codeTime = 0
							}
						  },1000)
					}
					var data = {
						mail:this.form.phone
					};
					console.log(data)
					// this.$api.getMailCode(data).then((res) => {
					// 	var resData = res;
					// 	console.log(resData)
					// 	if (resData.code == "200") {
							
					// 	}
					// })
					
					var uri = getApp().globalData.url + 'modules/serviceUser/getMailCode?mail='+this.form.phone;
					
					uni.request({
						url: uri,
						data:{} ,
						method: 'GET',
						header: {
							'content-type': 'application/json'
						},
						success(res) {
							var resData = res.data;
							console.log("==============111===========")
							console.log(resData)
							if (resData.code == "200") {
								
							} 
						},
						fail: (res) => {
							
						}
					})
			   }
			
		}
	}
</script>
 
<style lang="less">
	page {
		background-size: 30px 30px;
		// background-color: $page-bg !important;
	}
	
	.css-theme {
		@include text-color();
		@include base-background();
		@include border-color();
		@include shadow-color();
	}
	.pwd{
		border:none;
	}
	._top_text{
		font-size: 24px;
		font-weight: bold;
		padding-top: 220rpx;
		margin-left:40rpx;
		margin-bottom: 50rpx;
		letter-spacing:5rpx;
	}
	.loginWrap{
		.imgWrap{
			text-align: center;
			// padding: 50upx;
		}
		.loginForm{
			// padding: 5px;
			// font-size: 24rpx;
			// font-family: microsoft yahei;
			.uni-form-item{
				display: flex;
				align-items: center;
				justify-content: space-between;
				// border: 1upx solid #F1F1F1;
				padding: 20upx 0upx 20upx 30upx;
				margin: 20upx;
				u-input{
					flex: 1;
				}
				.forgetText{
					color: #C8C7CC;
				}
				
			}
			// .uni-form-item_other{
			// 	display: flex;
			// 	align-items: center;
			// 	justify-content: space-between;
			// 	// border: 1upx solid #F1F1F1;
			// 	padding: 20upx 0upx 20upx 30upx;
			// 	margin: 20upx;
			// 	input{
			// 		flex: 1;
			// 		width:80%
			// 	}
			// 	.forgetText{
			// 		color: #C8C7CC;
			// 	}
				
			// }	
			.uni-form-item_bottom{
			
				
				align-items: center;
				justify-content: space-between;
				padding: 0upx 0upx 5upx 30upx;
				margin: 5upx;
				font-size: 13px;
				text-align: left;
			
			}	
			// .wrap{
			// 	height: auto;
			// }
			// .loginbtn{
			// 	margin: 50rpx; margin-top: 25upx;background: #18B998;color: #fff;
			// 	border-radius: 30px;
			// 	font-size: 16px;
			// 	height:88rpx;
			// 	line-height: 88rpx;
				
			// }
		}
		.wechatLogin{
			margin-top: 60upx;
			text{
				color: #CCCCCC;
			}
			.wechatLoginBtn{
				// background-image: url(../../static/images/logo2.png);
				border: none;
				width: 32px;
				height: 32px;
				&::after{
					border: none;
				}
			}
			image{
				width: 54upx;
				height: 54upx;
				margin-top: 30upx;
			}
		}
	}
	.uni-form-item_other {
			display: flex;
			align-items: center;
			justify-content: space-between;
			margin: 50rpx;
		}
	
		.uni-form-item_other input {
			flex: 1;
			/* border: none; */
			height: 96rpx;
			font-size: 17px;
			font-weight: bold;
			/* background-color: none; */
			/* border-bottom: 1px solid #f1f1f1; */
			border:1px solid #ccc;
			border-radius: 5px;
			// background-color: #FCE9E9;
		}
	
		.uni-form-item_other_input {
			flex: 1;
			width: 80%;
			border: none;
			height: 80rpx;
			font-size: 17px;
			font-weight: bold;
			padding: 0px 5px;
			// background-color: #FCE9E9 !important;
		}
	
		.uni-form-item_bottom {
	
			align-items: center;
			justify-content: space-between;
			padding: 0upx 0upx 5upx 30upx;
			margin: 5upx;
			font-size: 13px;
			text-align: left;
	
		}
	
		.loginbtn {
			margin: 50rpx;
			margin-top: 25upx;
			background: #18B998;
			color: #fff;
			border-radius: 30px;
			font-size: 16px;
			height: 100rpx;
			line-height: 100rpx;
			// border: 1px solid #AB7559;
	
		}
</style>
